<!-- 我的钱包 -->
<template>
	<view class="page_box">
		<view class="head_box">
			<cu-custom :isBack="true">
				<block slot="backText"></block>
				<block slot="content">星星记录</block>
			</cu-custom>
			<!-- <image class="resale-bg" src="/static/resale_bg.png" mode=""></image> -->
		</view>
		<view class="content_box padding">
			<view
				class="bg-white radius padding-xs flex justify-between align-center margin-bottom shadow-warp"
				v-for="(item, index) in data"
				:key="index"
				@click="recording(item.user_id)"
			>
				<view class="flex">
					<image
						:src="'http://xyht.qianjitianxia.com/' + item.avatar"
						mode="aspectFill"
						class=" round"
						style="width: 100rpx; height: 100rpx;"
					></image>
					<view class="margin-left flex flex-direction justify-around">
						<text class="text-black">{{ item.nickname }}</text>
						<text class="text-black">{{ item.mobile }}</text>
					</view>
				</view>
				<view class="flex flex-direction justify-around align-end">
					<text class="text-price text-red  text-lg text-bold">{{ item.money }}</text>
					<text class="">{{ item.memo }}</text>
				</view>
			</view>
			<shopro-empty v-if="!data.length" :emptyData="emptyData"></shopro-empty>
		</view>
		<view class="foot_box"></view>

		<!-- 自定义底部导航 -->
		<shopro-tabbar></shopro-tabbar>
		<!-- 关注弹窗 -->
		<shopro-float-btn></shopro-float-btn>
	</view>
</template>

<script>
import { mapState, mapActions } from 'vuex';
export default {
	components: {},
	data() {
		return {
			emptyData: {
				img: this.$IMG_URL + '/imgs/empty/empty_goods.png',
				tip: '暂无记录~',
			},
			showModal: false,
			showModal1: false,
			money: '',
			money1: '',
			mobile: '',
			rules: '',
			data: [],
		};
	},
	computed: {
		...mapState({
			userinfo: state => state.user.userInfo,
		}),
	},
	onLoad() {
		this.getUserInfo1();
	},
	methods: {
		...mapActions(['getUserInfo']),
		jump(path, parmas) {
			this.$Router.push({
				path: path,
				query: parmas,
			});
		},

		async recording(user_id) {
			//subordinate
			let that = this;
			that.$api('recording', {
				user_id,
			}).then(res => {
				this.data = res.data;
				console.log('res111111111 :>> ', res);
			});
		},
		async getUserInfo1() {
			let that = this;
			that.$api('subordinate', {}).then(res => {
				this.data = res.data;
			});
		},

		postMoney1() {
			if (!this.mobile) return this.$tools.toast('请输入手机号码');
			if (!this.money1) return this.$tools.toast('请输入转账金额');
			let that = this;
			that.$api('transfer', {
				money: that.money1,
				mobile: that.mobile,
			}).then(res => {
				[this.mobile, this.money1, this.showModal1] = ['', '', false];
				this.getUserInfo();
				// this.mobile = '';
				// this.money1 = '';
				// this.showModal1 = false;
				console.log('res :>> ', res);
			});
		},

		postMoney() {
			this.apply();
			this.showModal = false;
		},
		onInput() {
			if (+this.userinfo.money > 0 && +this.userinfo.money < +this.money) {
				setTimeout(() => {
					this.money = this.userinfo.money;
				}, 0);
			}
		},
		// 提现
		apply() {
			let that = this;
			that.$api('user_wallet_apply.apply', {
				money: that.money,
			}).then(res => {
				if (res.code === 1) {
					//  #ifdef MP-WEIXIN
					this.$store.dispatch('getMessageIds', 'wallet');
					//  #endif
					this.$tools.toast(res.msg);
					that.getUserInfo();
				}
			});
		},
		// 提现规则
		getApplyRules() {
			let that = this;
			that.$api('user_wallet_apply.rule').then(res => {
				if (res.code === 1) {
					that.rules = res.data;
				}
			});
		},
		onWithdrawals() {
			if (this.userinfo.money <= 0) {
				this.$tools.toast('暂无可提现余额');
			} else {
				this.showModal = true;
			}
		},

		onWithdrawals1() {
			if (this.userinfo.money <= 0) {
				this.$tools.toast('暂无可提现余额');
			} else {
				this.showModal1 = true;
			}
		},
	},
};
</script>

<style lang="scss" scoped>
view {
	font-family: PingFang SC;
	text {
		font-family: PingFang SC;
	}
}
// 提现弹窗
.modal-box {
	background: #fff;
	width: 610rpx;
	margin: 0 auto;
	border-radius: 20rpx;
	.modal-head-img {
		width: 100%;
		height: 213rpx;
	}

	.modal-head-title {
		font-size: 35rpx;
		font-family: PingFang SC;
		font-weight: bold;
		color: #6d5028;
		line-height: 42rpx;
	}

	.inp {
		width: 501rpx;
		height: 78rpx;
		border: 1rpx solid rgba(168, 112, 13, 1);
		margin: 60rpx auto 40rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: #6d5028;

		.pl-inp {
			color: #bd9560;
		}
	}

	.radio {
		width: 500rpx;
		padding: 0 50rpx;
		font-size: 24rpx;
		font-family: PingFang SC;
		font-weight: 400;
		color: rgba(200, 150, 61, 1);
		margin-bottom: 20rpx;

		.radio-inp {
			transform: scale(0.7);
			margin-right: 10rpx;
		}
	}

	.post-btn {
		width: 492rpx;
		height: 70rpx;
		background: linear-gradient(90deg, rgba(233, 180, 97, 1), rgba(238, 204, 137, 1));
		box-shadow: 0px 7rpx 6rpx 0px rgba(229, 138, 0, 0.22);
		border-radius: 35rpx;
		font-size: 28rpx;
		font-family: PingFang SC;
		font-weight: 500;
		color: rgba(255, 255, 255, 1);
		padding: 0;
		margin-bottom: 60rpx;
	}
}
</style>
